<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>

  <style>
    body {
      margin: 0;
    }
    html, body, .wrapper {
      height: 100%;
    }

    .wrapper {
      display: flex;
      flex-direction: column;
    }

    .scroll {
      flex: 1;
      overflow: auto;
    }

    .item_wrapper {
      border: 1px solid red;
      display: flex;
      padding: 16px;
      margin: 32px;
      border-radius: 16px;
    }

    .left_img {
      width: 250px;
      margin-right: 16px;
      border-radius: 16px;
    }

    .container {
      flex: 1;
      /* background-color: azure; */
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: 16px 0;
    }

    .info {
      display: flex;
      justify-content: space-between;
    }

    .time {
      color: rgba(0, 0, 0, 0.5);
    }

    .tab {
      height: 100px;
      background-color: aquamarine;
      display: flex;
      justify-content: space-around;
      align-items: center;
    }
    .icon {
      width: 60px;
      height: 60px;
      background-color: gray;
      border: 6px;
    }
    
  </style>
</head>
<body>
  <div class="wrapper">
    <div class="scroll">
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container">
          <div class="title">工信部征求意见：电动自行车拟禁用车载充电器，完善永久性标识</div>
          <div class="info">
            <div class="info_lfet">
              <span>观察者网</span>
              <span class="time">04-25 14:26</span>
            </div>
            <div class="info_right">
              播报
            </div>
          </div>
        </div>
      </div>
    
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
    
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
    
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
    
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
    
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
      <div class="item_wrapper">
        <img class="left_img" src="https://gimg3.baidu.com/search/src=http%3A%2F%2Fpics7.baidu.com%2Ffeed%2F6f061d950a7b0208c2efc4bbd03a1bde562cc8bc.jpeg%40f_auto%3Ftoken%3Ddd9f8b81164d1c7f038da64a2d4f5e44&refer=http%3A%2F%2Fwww.baidu.com&app=2021&size=f360,240&n=0&g=0n&q=75&fmt=auto?sec=1714237200&t=6258ec4abaff361cb1aa87af2df613d8" alt="">
    
        <div class="container"></div>
      </div>
    </div>
    <div class="tab">
      <div class="icon"></div>
      <div class="icon"></div>
      <div class="icon"></div>
      <div class="icon"></div>
    </div>
  </div>
  
</body>
<script>

var MyFunc = (function() {
  var name = "Mozilla";
  var count = 0

  function setCount() {
    count += 1;
  }

  function setName1(__name) {
    name = __name
  }

  // const getName__ = function() {
  //   return name
  // }
  const getName = () => {
    return name
  }

  return {
    getCount: function() {
      return count
    },
    setCount: setCount,
    setName: setName1,
    getName
  };
})();


const {setName, getName, setCount, getCount} = MyFunc
// const setName = MyFunc.setName
// const getName = MyFunc.getName

setName('TOM')
console.log(getName())

setName('Jerry')
console.log(getName())

setCount()
setCount()
setCount()
setCount()
setCount()
setCount()

console.log(getCount())

</script>
</html>